<style>
	.layui-input-block {
		margin-left: 120px;
	}
</style>
<form class="layui-form" action="" id="orderEditForm">
	<label class="layui-form-label col-sm-1 " style="width:150px;padding-left:0px;margin-left:0px;">物料信息</label>
	<HR style="border:3 double #987cb9" width="100%" color=#987cb9 SIZE=3>
	<div class="layui-form-item" style="padding-top:20px">
		<label class="layui-form-label col-sm-1" style="width:150px;"><font color='red' size="4">*</font>父件编码</label>
		<div class="layui-input-block col-sm-2" style="width:250px;padding-left:0px;margin-left:0px;">
			<!-- BOM父件信息 -->
			<select name="coding" style="width:240px;" lay-verify="required" required lay-ignore></select>
			<input type="hidden" class="layui-input" name="materialId" lay-verify="required" />
		</div>
		<label class="layui-form-label col-sm-1" style="width:150px;"><font color='red' size="4">*</font>父件名称</label>
		<div class="layui-input-block col-sm-2" style="width:250px;padding-left:0px;margin-left:0px;">
			<input type="text" readOnly='true' class="layui-input" required name="name" lay-verify="required" />
		</div>
		<label class="layui-form-label col-sm-1" style="width:150px;">规格</label>
		<div class="layui-input-block col-sm-2" style="width:250px;padding-left:0px;margin-left:0px;">
			<input type="text" readOnly='true' class="layui-input" required name="spec" lay-verify="required" />
		</div>
	</div>
	<div class="layui-form-item">
		<label class="layui-form-label col-sm-1" style="width:150px;"><font color='red' size="4">*</font>计量单位</label>
		<div class="layui-input-block col-sm-2" style="width:250px;padding-left:0px;margin-left:0px;">
			<input type="hidden" name="measurementUId" id='measurementUId' lay-verify="required" />
			<input type="text" readOnly='true' class="layui-input" required name="measurementUName" lay-verify="required" />
		</div>
		<label class="layui-form-label col-sm-1" style="width:150px;"><font color='red' size="4">*</font>级次</label>
		<div class="layui-input-block col-sm-2" style="width:250px;padding-left:0px;margin-left:0px;">
			<input type="number" class="layui-input" required name="level" lay-verify="required" value='0' />
		</div>
		<label class="layui-form-label col-sm-1" style="width:150px;"><font color='red' size="4">*</font>版本号</label>
		<div class="layui-input-block col-sm-2" style="width:250px;padding-left:0px;margin-left:0px;">
			<input type="text" class="layui-input" required name="version" lay-verify="required" />
		</div>
	</div>
	<div class="layui-form-item">
		<label class="layui-form-label col-sm-1" style="width:150px;"><font color='red' size="4">*</font>成品率%</label>
		<div class="layui-input-block col-sm-2" style="width:250px;padding-left:0px;margin-left:0px;">
			<input type="text" class="layui-input" required name="rateFinish" lay-verify="required" />
		</div>
	</div>

	<!-- 分割线 -->
	<label class="layui-form-label col-sm-1 " style="width:150px;padding-left:0px;margin-left:0px;">父件属性</label>
	<HR style="border:3 double #987cb9" width="100%" color=#987cb9 SIZE=3>
	<div class="layui-form-item">
		<label class="layui-form-label col-sm-1" style="width:150px;"><font color='red' size="4">*</font>是否默认BOM</label>
		<div class="layui-input-block col-sm-2" style="width:250px;padding-left:0px;margin-left:0px;">
			<input type="radio" name="isDefault" value="true" title="是">
			<input type="radio" name="isDefault" value="false" title="否" checked>
		</div>
		<label class="layui-form-label col-sm-1" style="width:150px;"><font color='red' size="4">*</font>是否停用</label>
		<div class="layui-input-block col-sm-2" style="width:250px;padding-left:0px;margin-left:0px;">
			<input type="radio" name="isNoUsed" value="true" title="是">
			<input type="radio" name="isNoUsed" value="false" title="否" checked>
		</div>
	</div>
	<div class="layui-form-item">
		<label class="layui-form-label col-sm-1 " style="width:150px;">备注</label>
		<div class="layui-input-block col-sm-2" style="width:80%;padding-left:0px;margin-left:0px;">
			<input type="text" class="layui-input" name="remark" />
		</div>
	</div>
	<div class="layui-form-item">
		<div class="layui-input-block">
			<button class="layui-btn" lay-submit="" lay-filter="formSubmit" authcode='900240'>提交</button>
			<button type="button" class="layui-btn layui-btn-primary" id="closeBtn">关闭</button>
		</div>
	</div>

</form>
<script>
	layui.use('form', function() {
		$("[name='coding']").select2({
			placeholder: "请选择存货信息", //placeholder
			language: 'zh-CN', //中文语言
			//allowClear:true,//出现删除按钮图片，可以清除下拉选中内容
			ajax: {
				url: "/eng/material/info/data",
				dataType: 'json',
				delay: 350,
				data: function(params) {
					return {
						name: params.term, // search term
						companyid: 1,
						page: params.page,
						limit: 30
					};
				},
				processResults: function(data, params) {
					params.page = params.page || 1;
					return {
						results: data.data,
						pagination: {
							more: (params.page * 30) < data.count
						}
					};
				},
				cache: true
			},
			escapeMarkup: function(markup) { return markup; }, // let our custom formatter work
			minimumInputLength: 0, //最小输入字符，输入最小字符后开始后台请求
			templateResult: formatRepo, // 处理远程返回数据
			templateSelection: formatRepoSelection // 设置下拉选中后显示内容
		});

		function formatRepo(repo) {
			//下拉展示内容可以修改自定义样式
			if(repo.loading) return repo.text;
			var markup = "<div class=\"layui-row\" style='width:250px;'>" +
				"<div class=\"layui-col-xs4 layui-col-sm4 layui-col-md3\">" +
				"<div class=\"grid-demo grid-demo-bg1\">" + repo.materialCoding + "</div>" +
				"</div>" +
				"<div class=\"layui-col-xs8 layui-col-sm8 layui-col-md9\">" +
				"<div class=\"grid-demo grid-demo-bg1\">" + repo.materialName + "</div>" +
				"</div>";

			return markup;
		}

		function formatRepoSelection(repo) {
			return repo.materialCoding; //选中返回select中的值
		}
		var form = layui.form; //只有执行了这一步，部分表单元素才会自动修饰成功
		form.render();
		//物料信息选择带回事件
		$("[name='coding']").on("select2:select", function(e) {
			//设置ID回去
			$("input[name='materialId']").val(e.params.data.id);
			//设置物料名称回去
			$("input[name='name']").val(e.params.data.materialName);
			//设置物料规格回去
			$("input[name='spec']").val(e.params.data.materialSpec);
			//设置计量单位回去
			$("input[name='measurementUName']").val(e.params.data.measurementUName);
			//设置物料类型回去
			$("input[name='measurementUId']").val(e.params.data.measurementUId);
		});

		//监听提交
		form.on('submit(formSubmit)', function(data) {
			$.ajax({
				type: "POST",
				url: "/eng/bom/addBom",
				data: $("#orderEditForm").serializeJson(),
				dataType: "json",
				success: function(data) {
					if(data.code == 200) {
						//关闭弹出层
						layer.close(editdialogindex);
						layer.msg(result.message, { icon: 6 });
						//更新表格数据
						ins.reload({ url: '/eng/bom/data' });
					} else {
						layer.msg(data.message);
						//关闭
						layer.closeAll();
					}
				}
			});
		});
	//关闭按钮
	  $("#closeBtn").click(function(){
		  layer.closeAll();
	  })
	});
</script>